<html>
  <head>
    <meta charset="utf-8" />
    <title>3d可交互婚纱照</title>
    <link href="./index.css" rel="stylesheet" />
    <style>
      body {
        margin: 0;
      }
    </style>
  </head>
  <audio
    id="bg_music"
    autostart="true"
    loop="true"
    preload="auto"
    controls="controls"
    src="./music/laxh.mp3"
  ></audio>
  <!-- 说明：
        1、使用autoplay="autoplay"，则背景音乐将在音网页打开后就自动马上播放。

        2、使用controls="controls"，则为了在页面内显示显示控件，如播放按钮。

        3、使用"loop="loop"，则是为了是背景音乐重复播放。

        4、使用preload="auto"，则音频在页面加载的同时进行加载，并预备播放。

        5、使用src=""，即是在""内加入背景音乐的保存路径，如：src=""。

        注：若是想播放按钮隐藏，则使用以下语句：

        直接使用css 的display控制audio标签的显示： -->
  <style type="text/css">
    audio {
      display: none;
    }
  </style>

  <body id="body">
    <script type="importmap">
      {
        "imports": {
          "three": "./js/three.js",
          "three/addons/": "./jsm/"
        }
      }
    </script>
    <script type="module" src="src/mycube.js"></script>
    <div
      id="start_div"
      style="
        position: absolute;
        z-index: 999;
        width: 100%;
        height: 100%;
        font-size: xxx-large;
        display: flex;
        align-items: center;
        justify-content: center;
      "
    >
      点击播放
    </div>
  </body>
</html>
